<template>
	<view class="pbgf">
		<view class="p2432">
			<view class="mt60">
				<view class="flex_y">
					<image class="img164" src="/static/classify/succeedPay.png" mode=""></image>
				</view>
				<view class="mt24 c3 fw600 fs36 tc">提交成功</view>
				<view class="mt48 c6 fs26 tc">
					<view class="">您的订单已提交</view>
					<view class="mt4">请将物品交给服务点工作人员</view>
				</view>
				<view class="mt24 btn cf fw500 fs26 flex_c" @click="checkOrder">查看订单</view>

				<view class="mt80 flex_x">
					<view class="line"></view>
					<view class="flex1 mlr24 c3 fw500 fs28">更多福利</view>
					<view class="line"></view>
				</view>

				<view class="mt24">
					<view class="pr coupon br12 mb20" v-for="item in coupon_list">
						<image class="w100 h100" src="/static/my/user/coupon/coupon.png" mode=""></image>
						<view class="pa0 w100 h100 br10">
							<view class="coupona flex_c">
								<view class="price flex_col flex_c">
									<view class="tc fw600">
										<text class="fs28">￥</text>
										<text class="fs50">{{item.price}}</text>
									</view>
									<view class="mt4 tc fs24">{{item.money ==0?'无门槛卷':'满'+item.money+'使用'}}</view>
								</view>
								<view class="flex1 mlr50">
									<view class="c3 fw600 fs32 sn1">{{item.name}}</view>
									<view class="mt12 c9 fs20">
										<view class="">有效期：</view>
										<view class="mt4">{{item.workrange}}</view>
									</view>
								</view>
								<view class="coupon_btn flex_c">
									<view class="coupon_btna flex_c fs26" @click="employ(item)">立即领取</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				id: '', //订单id
				coupon_list: [], //优惠卷列表
			}
		},
		onLoad(options) {
			if (options.id) {
				this.id = options.id
			}
			this.couponList()
		},
		onShow() {

		},
		methods: {
			couponList() { //优惠卷列表
				this.$api.couponList({
					type: 2
				}).then(res => {
					if (res.code == 1) {
						this.coupon_list = res.data.data
					}
				})
			},
			employ(item) { //领取优惠券
				this.$api.receiveCoupon({
					ids: item.id
				}).then(res => {
					if (res.code == 1) {
						this.couponList();
					}
					uni.$u.toast(res.msg)
				})
			},

			checkOrder() { //查看订单详情
				uni.redirectTo({
					url: `/pages/user/my/orderDetails/orderDetails?id=${this.id}`
				})
			},
		},
		computed: {

		},
		watch: {

		}
	}
</script>

<style lang="scss" scoped>
	.btn {
		height: 80upx;
		background: #CD3314;
		border-radius: 40upx;
	}

	.line {
		width: 263upx;
		height: 1upx;
		background: #666666;
	}

	.coupon {
		height: 166upx;

		.coupona {
			height: 118upx;
			padding: 24upx;
		}

		.price {
			width: 130upx;
			height: 100%;
			color: #FAE9AB;
		}

		.coupon_btn {
			width: 160upx;
			height: 100%;

			.coupon_btna {
				width: 148upx;
				height: 52upx;
				background: #CD3314;
				box-shadow: 0px 0px 4upx 0px rgba(198, 198, 198, 0.5);
				border-radius: 41upx;
				color: #FAE9AB;
			}
		}
	}
</style>
